import {ref, watchEffect, onMounted, onUnmounted} from 'vue'

export function useMouse() {
    const x = ref(0)
    const y = ref(0)
    function update(e) {
        x.value = e.pageX
        y.value = e.pageY
    }
    onMounted(() => {
        window.addEventListener('mousemove', update)
    })
    onUnmounted(() => {
        window.removeEventListener('mousemove', update)
    })
    return {x, y}
}

export function useStorage(name, value = []) {
    let data = ref(JSON.parse(localStorage.getItem(name) || '[]'))
    watchEffect(() => {
        localStorage.setItem(name, JSON.stringify(data.value))
    })
    return data
}